<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <title>Document</title>
        <style>
            * {
                margin: 0;
                padding: 0;
                box-sizing: border-box;
            }
            html,
            body {
                width: 100%;
                height: 100%;
            }
            .wwz {
                width: 100%;
                height: 100%;
                background-color: salmon;
                position: absolute;
                top: 0px;
                display: none;
            }
            .hhh {
                width: 400px;
                height: 200px;
                margin: 300px auto;
                background-color: white;
                font-size: 100px;
                display: flex;
                align-items: center;
                justify-content: center;
                cursor: pointer;
            }
        </style>
    </head>
    <body>
        <button>点击弹出</button>
        <div class="wwz">
            <div class="hhh">关闭</div>
        </div>
        <script>
            let btn = document.querySelector("button");
            let A = (function () {
                let instance;
                class A {
                    constructor(btn) {
                        this.btn = btn;
                        this.open();
                    }
                    open() {
                        let next = this.btn.nextElementSibling;
                        this.btn.addEventListener("click", () => {
                            next.style.display = "block";
                        });
                        next.childNodes[1].addEventListener("click", () => {
                            next.style.display = "none";
                        });
                    }
                }
                return function single(btn) {
                    if (!instance) instance = new A(btn);
                    return instance;
                };
            })();
            let a = new A(btn);

            // 会自动执行
            let B = (function () {
                // 返回falsee
                let instance;
                class B {
                    constructor(name) {
                        this.name = name;
                    }
                }
                //会返回他自己的参数
                return function single(name) {
                    // 会改变zhuang态
                    if (!instance) instance = new B(name);
                    // 返回
                    return instance;
                };
            })();
            let bb = new B("heiheihei");
            let c = new B("王伟振");
            console.log(bb.name);
        </script>
    </body>
</html>
